<template>
	<view class="content">
		<view class="title">{{ Details.title }}</view>
		<view class="tip">
			<view>{{ Details.createBy }}</view>
			<view>{{ Details.createTime | jiequ }}</view>
		</view>

		<!-- <view class="conten"><rich-text :nodes="Details.content"></rich-text></view> -->
		<view>{{ strArr[0] }}</view>
		<view>{{ strArr[1] }}</view>
		<text>{{strArr[2]}}</text>
		<view>{{strArr[5]}}</view>
		<!-- <view v-show="strArr[2] === '犬只性别：1'">犬只性别:雄</view>
		<view v-show="strArr[2] === '犬只性别：0'">犬只性别:雌</view> -->
		<view class="dog" style="display: flex;flex-wrap: wrap;">
			<image style="margin: 10upx;" @tap="yulan(val)" class="img" :src="val" mode="aspectFit" v-for="val of Details.files"
			 :key="val"></image>
			<!-- <view class="text">
				<view class="">犬名:{{}}</view>
				<view class="">犬只年龄:{{}}</view>
				<view class="">犬只性别:{{}}</view>
			</view> -->
		</view>
	</view>
</template>

<script>
	import {
		mapState
	} from 'vuex';
	import CHONG from '../../static/js/function.js';
	export default {
		computed: mapState(['URL']),
		data() {
			return {
				Details: {},
				strArr: []
			};
		},
		methods: {
			yulan(e) {
				uni.previewImage({
					current: e,
					urls: this.Details.files,
					success: () => {
						console.log("ddd");
					}
				})
			}
		},
		onLoad(res) {
			uni.showShareMenu({
				withShareTicket: true
			});
			uni.request({
				url: this.URL + 'dndetail',
				data: {
					id: res.id
				},
				success: res => {
					console.log(res.data);

					if (!res.data.success) {
						CHONG.tip(res.data.msg);
					} else {
						this.Details = res.data.data[0];
						this.Details.files = this.Details.files.split(",");
						this.Details.content = this.Details.content.replace(/\<p/gi, '<p style="margin:10px;"');
						this.strArr = this.Details.content.split('；', 6);
					}
				}
			});
		}
	};
</script>

<style>
	.title {
		font-size: 50upx;
		text-align: center;
	}

	.tip {
		margin: 20upx 0;
		padding: 0 50upx;
		font-size: 30upx;
		color: #888888;
		display: flex;
		justify-content: space-between;
	}

	.conten {
		margin: 50upx 0;
		padding: 0 20upx;
	}

	uni-rich-text {
		text-indent: 2em;
	}

	.dog {
		display: flex;
		justify-content: center;
		align-items: center;
	}

	/* .dog .img {
	width: 120upx;
	height: 120upx;
} */
	.dog .text {
		padding-left: 60upx;
		font-size: 26upx;
	}
</style>
